<template lang="">
    <div>
        <!-- 面包屑导航 -->
        <el-breadcrumb separator="/">
            <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item><a href="/">菜单管理</a></el-breadcrumb-item>
        </el-breadcrumb>
        <!-- 添加按钮 -->
          <el-button type="primary" class="add">添加</el-button>
          <!-- 表格渲染 -->
          <template>
     <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="date" label="菜单编号" width="180">
      </el-table-column>
      <el-table-column prop="name" label="菜单名称" width="180">
      </el-table-column>
      <el-table-column prop="address" label="上级菜单"> </el-table-column>
      <el-table-column prop="address" label="菜单图标"> </el-table-column>
      <el-table-column prop="address" label="菜单地址"> </el-table-column>
      <el-table-column prop="address" label="状态"> </el-table-column>
      <el-table-column prop="address" label="操作">
          <el-button type="primary">编辑</el-button>
           <el-button type="danger">删除</el-button>
    </el-table-column>
    </el-table>
</template>

    </div>
</template>
<script>
export default {
    data() {
        return {
            tableData: [{
                date: '2016-05-02',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }, {
                date: '2016-05-04',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1517 弄'
            }, {
                date: '2016-05-01',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1519 弄'
            }, {
                date: '2016-05-03',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1516 弄'
            }]
        }
    }
};
</script>
<style lang="less" scoped>
.add {
    margin-top: 20px;
}
</style>